<load target="js/communication_admin.js" usecdn="true" />
<load target="../../editor/tpl/js/editor_module_config.js" usecdn="true" />

<div class="x_page-header">
	<h1>
		{$lang->communication} {$lang->cmd_management}
		<a href="#aboutCommunication" class="x_pull-right x_icon-question-sign" data-toggle style="margin-top:13px">{$lang->help}</a>
	</h1>
</div>

<p class="x_alert x_alert-info" id="aboutCommunication" hidden>{nl2br($lang->about_communication)}</p>

<div cond="$XE_VALIDATOR_MESSAGE && $XE_VALIDATOR_ID == 'modules/communication/tpl/index/1'" class="message {$XE_VALIDATOR_MESSAGE_TYPE}">
	<p>{$XE_VALIDATOR_MESSAGE}</p>
</div>

<form ruleset="insertConfig" action="./" method="post" class="x_form-horizontal">
	<input type="hidden" name="module" value="communication" />
	<input type="hidden" name="act" value="procCommunicationAdminInsertConfig">
	<input type="hidden" name="xe_validator_id" value="modules/communication/tpl/index/1" />

	<div class="x_control-group">
		<label class="x_control-label" for="editor_skin">{$lang->editor_skin}</label>
		<div class="x_controls">
			<select name="editor_skin" id="editor_skin" onchange="getEditorSkinColorList(this.value)">
				<option loop="$editor_skin_list => $editor_skin" value="{$editor_skin}" selected="selected"|cond="$editor_skin==$communication_config->editor_skin">{$editor_skin}</option>
			</select>
			<select name="sel_editor_colorset" style="display:none">
			</select>
			<script>
			//<![CDATA[
				getEditorSkinColorList('{$communication_config->editor_skin}','{$communication_config->editor_colorset}');
			//]]>
			</script>
		</div>
	</div>
	<div class="x_control-group">
		<label class="x_control-label" for="layout">{$lang->layout}</label>
		<div class="x_controls">
			<select id="layout" name="layout_srl" style="width:auto">
				<option value="0">{$lang->notuse}</option>
				<option loop="$layout_list => $key,$val" value="{$val->layout_srl}" selected="selected"|cond="$val->layout_srl == $communication_config->layout_srl">{$val->title} ({$val->layout})</option>
			</select>
		</div>
	</div>
	<div class="x_control-group">
		<label class="x_control-label" for="skin">{$lang->skin}</label>
		<div class="x_controls">
			<select name="skin" id="skin" style="width:auto" onchange="doGetSkinColorset(this.options[this.selectedIndex].value, 'P')">
				<option loop="$communication_skin_list => $key, $val" value="{$key}" selected="selected"|cond="$key==$communication_config->skin">{$val->title}</option>
			</select>
		</div>
	</div>
	<div class="x_control-group" id="__skin_colorset">
		<label class="x_control-label">{$lang->colorset}</label>
		<div class="x_controls">
			<div id="communication_colorset"></div>
		</div>
	</div>
	<div class="x_control-group">
		<label class="x_control-label" for="mlayout_srl">{$lang->mobile_layout}</label>
		<div class="x_controls">
			<select id="mlayout_srl" name="mlayout_srl" style="width:auto">
				<option value="0">{$lang->notuse}</option>
				<option loop="$mlayout_list => $key,$val" value="{$val->layout_srl}" selected="selected"|cond="$val->layout_srl == $communication_config->mlayout_srl">{$val->title} ({$val->layout})</option>
			</select>
		</div>
	</div>
	<div class="x_control-group">
		<label class="x_control-label" for="mskin">{$lang->mobile_skin}</label>
		<div class="x_controls">
			<select name="mskin" id="mskin" style="width:auto" onchange="doGetSkinColorset(this.options[this.selectedIndex].value, 'M')">
				<option loop="$communication_mobile_skin_list => $key,$val" value="{$key}" selected="selected"|cond="$key==$communication_config->mskin" >{$val->title}</option>
			</select>
		</div>
	</div>
	<div class="x_control-group" id="__mskin_colorset">
		<label class="x_control-label">{$lang->colorset}</label>
		<div class="x_controls">
			<div id="communication_mcolorset"></div>
		</div>
	</div>

	<div class="btnArea">
		<button class="x_btn x_btn-primary" type="submit">{$lang->cmd_registration}</button>
	</div>
</form>
<script>
    jQuery(function() { 
		doGetSkinColorset("{$communication_config->skin}", 'P'); 
		doGetSkinColorset("{$communication_config->mskin}", 'M'); 
	});
</script>
